<template>
    <view class="fixb">
        <view class="cu-bar bg-white tabbar border shop">
            <button class="action" open-type="contact">
                <view class="cuIcon-service">
                </view> 客服
            </button>
            <view class="action" @click="$go(`/pages/tabs/cart/index`)">
                <view class="cuIcon-cart">
                    <view class="cu-tag badge" v-if="cart_num">{{ cart_num }}</view>
                </view>
                购物车
            </view>
            <view class="btn-group-r" v-if="goods.stock != 2">
                <button class="cu-btn round shadow-blur add-btn" @click.stop="complete">加入购物车</button>
                <button class="cu-btn round shadow-blur main-btn" @click.stop="complete">立即购买</button>
            </view>
            <view class="btn-group-r" v-else>
                <button class="cu-btn round shadow-blur pbtn-dis">已售罄</button>
            </view>
        </view>

       
    </view>
</template>

<script setup>
const {proxy} = getCurrentInstance()
const emit = defineEmits(['complete']);
const props = defineProps({
    goods: {
        type: Object,
        default: {}
    },
    cart_num: {
        type: [String, Number],
        default: 0
    }
})

function complete() {
    if(!proxy.$store.token){
        proxy.$go('/pages/login/login')
        return
    }
    emit('complete')
}
</script>

<style lang="scss" scoped>
.fixb {
    height: 120rpx;
}

.shop {
    width: 100%;
    height: 120rpx;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 99;
    .cuIcon-cart {
        color: #000;
    }

    .badge {
        background-color: #f00;
    }

    .btn-group-r {
        flex: 1;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding-left: 40rpx;

        .cu-btn {
            width: 220rpx;
            height: 80rpx;
            margin-right: 24rpx;
        }

        .main-btn {
            border: 1px solid $main_color;
            background-color: $main_color;
            color: #fff;
        }

        .add-btn {
            background-color: transparent;
            color: $main_color;
            border: 1px solid $main_color;
        }

        .pbtn-dis{
            flex: 1;
			background-color: #ececec;
			border: 1px solid #ececec;
			color: #999;
		}
    }

    
}


</style>